<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>派森编程</title>
    <link rel="stylesheet" href="style.css">
</head>

<body>
    <!-- header部分 -->
    <div class="header">
        <div class="w">
            <div class="logo">
                <img src="images/logo.png" alt="">
            </div>
            <div class="nav">
                <ul>
                    <li><a href="index.html">首页</a></li>
                    <li><a href="teach.html">师资</a></li>
                    <li><a href="feedback.html">反馈</a></li>
                </ul>
                <img src="./images/sousuo.png" alt="">
            </div>
            <div class="user">
                <a href="">登录</a>
            </div>
        </div>
    </div>
    <!-- banner部分 -->
    <div class="banner">
        <div class="w">
            <div class="banner_box">
                <img src="images/pycoding.png" alt="">
                <h2>带给你有趣、好玩、食用、易学的编程学习法</h2>
                <h1>让小白也能爱上变成,零基础,无门槛学习Python</h1>
            </div>
            <div class="banner_bottom">
                <a href="">开始学习</a>
            </div>
        </div>
    </div>
    <!-- container部分 -->
    <div class="container">
        <div class="w">
            <div class="container_title">
                <img src="./images/left.png" alt="">
                <p>课 程 亮 点</p>
                <img src="./images/right.png" alt="">
            </div>
            <div class="container_content">
                <div class="container_box">
                    <img src="./images/spot_1.png" alt="">
                    <h2>沉浸式学习</h2>
                    <p>让学习变成一种兴趣</p>
                </div>
                <div class="container_box">
                    <img src="./images/spot_2.png" alt="">
                    <h2>游戏化教学</h2>
                    <p>闯关中挑战中学</p>
                </div>
                <div class="container_box">
                    <img src="./images/spot_3.png" alt="">
                    <h2>项目实战强化</h2>
                    <p>实操演练巩固知识</p>
                </div>
                <div class="container_box">
                    <img src="./images/spot_4.png" alt="">
                    <h2>个性化学情分析</h2>
                    <p>弥补自身能力短板</p>
                </div>
            </div>
        </div>
    </div>
    <!-- feature部分 -->
    <div class="feature">
        <div class="w">
            <div class="feature_title">
                <img src="./images/left.png" alt="">
                <p>精 品 课 程</p>
                <img src="./images/right.png" alt="">
            </div>
            <div class="feature_content">
                <div class="feature_box">
                    <img src="./images/course_1.png" alt="">
                    <div class="feature_infobox">
                        <h1>实战Python语法</h1>
                        <p>实战掌握Python基础语法知识</p>
                        <p>从0基础提升Python编程思维</p>
                        <p>编写你的第一个人工智能程序</p>
                        <a class="one" href="">查看详情</a>
                    </div>
                </div>
                <div class="feature_box">
                    <img src="./images/course_2.png" alt="">
                    <div class="feature_infobox">
                        <h1>玩转Python爬虫</h1>
                        <p>掌握HTML网页结构以及爬虫实操</p>
                        <p>从工作场景出发理解爬虫应用</p>
                        <p>从0开始编写一个智能爬虫项目</p>
                        <a class="two" href="">查看详情</a>
                    </div>
                </div>
                <div class="feature_box">
                    <img src="./images/course_3.png" alt="">
                    <div class="feature_infobox">
                        <h1>职场高效自动化办公</h1>
                        <p>掌握数据库管理、数据分析及可视化的技能</p>
                        <p>实战图像识别、舆情分析以及自然语言分析</p>
                        <p>了解机器学习的基本流程以及智能算法原理</p>
                        <a class="three" href="">查看详情</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- bottom部分 -->
    <div class="bottom">
        <div class="w">
            <div class="bottom_content">
                <div class="infobox">
                    <p>Copyright(c) 2016广州互联网科技有限公司</p>
                    <p>地址:广州市海珠区宣悦东街23号</p>
                    <p>电话:(020)85200550</p>
                </div>
                <img src="./images/qrcode.png" alt="">
            </div>
        </div>
    </div>
</body>

</html>